<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>订单列表</title>
    <meta name="keywords" content="KEYWORDS..."/>
    <meta name="description" content="DESCRIPTION..."/>
    <meta name="author" content="DeathGhost"/>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name='apple-touch-fullscreen' content='yes'>
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="address=no">
    <link rel="icon" href="/1/images/icon/favicon.ico" type="image/x-icon">
    <meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" type="text/css" href="/1/css/style.css"/>
    <script src="/1/js/jquery.js"></script>
    <script src="/vendor/layer/layer.js"></script>
</head>
<body>
<!--header-->
<header>
    <a href="/home/user/index" class="iconfont backIcon">&#60;</a>
    <h1>订单列表</h1>
</header>
<div style="height:1rem;"></div>
<!--异步处理，此处不做TAB形式,注意当前状态样式currStyle-->
<aside class="orderSift">
    <a href="?" class="{{!isset($params['pay_status']) && !isset($params['status']) ? 'currStyle' : ''}}">全部</a>
    <a href="?pay_status=0" class="{{isset($params['pay_status']) && $params['pay_status'] == 0 ? 'currStyle' : ''}}">待付款</a>
    <a href="?pay_status=1&status=0" class="{{request('pay_status') == 1 && !request('status') ? 'currStyle' : ''}}">待发货</a>
    <a href="?pay_status=1&status=1" class="{{request('pay_status') == 1 && request('status') == 1 ? 'currStyle' : ''}}">已完成</a>
</aside>
<ul class="orderList">
    @foreach($list as $row)
        <li id="item-{{$row['id']}}">
            <dl>
                <dt>
                    <span>订单：{{$row['order_num']}}</span>
                    <span>
                        @if($row['status'] == 1)
                            已完成
                        @elseif($row['pay_status'] == 1)
                            待发货
                        @elseif($row['pay_status'] == 0)
                            未支付
                        @endif
                    </span>
                </dt>
                @foreach($row['orderDetails'] as $detail)
                    <dd>
                        <h2>{{$detail['name']}}</h2>
                        <strong>
                            <em>{{$detail['price']}}</em>
                            <span>{{$detail['num']}}</span>
                        </strong>
                    </dd>
                @endforeach
                <dd>
                    {{--<span>商品数量：<b>{{$row['num']}}</b></span>--}}
                    <span>实付：<b>{{$row['money']}}</b></span>
                </dd>
                <dd>
                    <a class="order_delBtn" onclick="del('{{$row['id']}}')">删除订单</a>
                    @if ($row['pay_status'] == 0)
                        <a class="order_payBtn" onclick="pay('{{$row['id']}}')">付款</a>
                    @elseif ($row['status'] == 1)
                        <a class="order_payBtn" onclick="alert('{{$row['express_num']}}')">查看运单号</a>
                    @endif
                </dd>
            </dl>
        </li>
    @endforeach
</ul>
<div style="height:.65rem;margin:.23rem auto;">
    @if(count($list) > 0)<a class="more_btn" onclick="loadMoreGoods()">加载更多</a>@endif
</div>
<div style="height:1.2rem;"></div>
@include('home.1.footer')
<script>
    var page = 1;
    function loadMoreGoods() {
        page++;
        layer.load(1, {shade: [0.2,'#999']});
        $.get(location.href, {page: page}, function (res) {
            layer.closeAll();
            if (res.data.length === 0) {
                $('.more_btn').hide();
            } else {
                var htmlItem;
                var htmlContent = '';
                for (var i = 0; i < res.data.length; i++) {
                    htmlItem = res.data[i];
                    var statusName = htmlItem.pay_status === 1 ? '已支付' : '未支付';
                    htmlContent += '<li id="item-' + htmlItem.id + '"><dl><dt><span>订单：' + htmlItem.order_num + '</span><span>' + statusName + '</span></dt>';
                    for (var j = 0; j < htmlItem.order_details.length; j++) {
                        var detail = htmlItem.order_details[j];
                        htmlContent += '<dd><h2>' + detail.name +'</h2><strong><em>' + detail.price +'</em><span>' + detail.num +'</span></strong></dd>';
                    }
                    htmlContent += '<dd><span>实付：<b>' + htmlItem.money + '</b></span></dd><dd>\
                        <a class="order_delBtn" onclick="del(' + htmlItem.id + ')">删除订单</a>';
                    if (htmlItem.pay_status === 0) {
                        htmlContent += '<a class="order_payBtn" onclick="pay(' + htmlItem.id + ')">付款</a>';
                    }
                    htmlContent += '</dd></dl></li>';
                }

                $('.orderList').append(htmlContent);
            }
        });
    }

    function pay(order_id) {
        layer.load(1, {shade: [0.2,'#999']});
        $.post('{{url('home/order/unifiedOrder')}}', {order_id: order_id}, function (res) {
            layer.closeAll();
            if (res.status === 1) {
                // 跳往主域名去支付
                location.href='{{$payUri}}&prepay_id=' + res.prepay_id;
            } else {
                alert(res.info);
            }
        });
    }

    function del(id) {
        if (confirm('确定要删除该订单吗')) {
            $.get('{{url('home/order/del')}}', {id: id}, function () {
                $('#item-' + id).remove();
            });
        }
    }
</script>
</body>
</html>
